<template>
  <el-table :data="movieData" style="width: 100%">
    <el-table-column type="expand">
      <template #default="props">
        <div m="4">
          <p m="t-0 b-2">电影时长: {{ props.row.length }}</p>
          <p m="t-0 b-2">电影评分: {{ props.row.score }}</p>
          <p m="t-0 b-2">电影观看量: {{ props.row.play_count }}</p>
          <p m="t-0 b-2">是否允许点赞: {{ props.row.Allow_like }}</p>
          <p m="t-0 b-2">是否允许收藏: {{ props.row.Allow_stars }}</p>
          <p m="t-0 b-2">是否允许喜欢: {{ props.row.Allow_love }}</p>
          <p m="t-0 b-2">是否允许评论: {{ props.row.Allow_comment }}</p>
          <p m="t-0 b-2">简介: {{ props.row.review }}</p>
        </div>
      </template>
    </el-table-column>
    <el-table-column type="index" :index="indexMethod" label="序号" width="60%"/>
    <el-table-column label="电影名" prop="name" />
    <el-table-column label="电影类型" prop="type" />
    <el-table-column label="观看等级" prop="level" />
    <el-table-column label="电影状态" prop="status" />
    <el-table-column fixed="right" label="操作">
      <template #default="props">
        <el-button link type="primary" size="small" @click="openEditDialog(props.row.MID)">编辑</el-button>
        <el-button link type="primary" size="small" @click="delVideo(props.row.MID,props.row.name)">删除</el-button>
      </template>
    </el-table-column>

  </el-table>
  <el-dialog v-model="edit_items" title="编辑" width="800">
    <edit_card :MID="edit_MID" @close-dialog="closeEditDialog"></edit_card>
  </el-dialog>

</template>

<script lang="ts" setup>
import {onMounted, ref} from 'vue'
import Edit_card from "@/items/video_items/edit_card.vue";
import {md5} from "js-md5";
import {ElMessage} from "element-plus";
import router from "@/router";

interface Movie {
  MID: string;
  fanart: string;
  type: string;
  length: string;
  name: string;
  score: string
  status: string;
  level: string;
  review: string;
  play_count: string;
  update_time: string;
  Allow_like: boolean;
  Allow_stars: boolean;
  Allow_love: boolean;
  Allow_comment: boolean;
}

const movieData = ref<Movie[]>([]);

const edit_items = ref(false);
const edit_MID = ref('');
const fetchMovieData = async () => {
  try {
    const response = await fetch('https://movie.cpb2013.top/discover.php');
    const responseData = await response.json();
    if (responseData.status === 'ok') {
      movieData.value = responseData.data.map((movie: any) => ({
        MID: movie.MID,
        fanart: movie.fanart,
        type: movie.type,
        length: movie.length,
        name: movie.name,
        status: movie.status,
        level: movie.level==0?"非会员":movie.level==1?"普通会员":movie.level==2?"超级会员":movie.level==3?"super会员":"非会员",
        review: movie.review,
        play_count: movie.play_count,
        update_time: movie.update_time,
        Allow_like: movie.Allow_like,
        Allow_stars: movie.Allow_stars,
        Allow_love: movie.Allow_love,
        Allow_comment: movie.Allow_comment,
        score: movie.score,
      }));
    } else {
      console.error('Error fetching movie data:', responseData.message);
    }
  } catch (error) {
    console.error('Error fetching movie data:', error);
  }
}

const indexMethod = (index: number) => {
  return index+1
}

const openEditDialog = (MID) => {
  edit_MID.value = MID;
  edit_items.value = true;
  console.log(edit_MID.value)
}

const closeEditDialog = () => {
  edit_items.value = false;
}

const delVideo = async (MID,name) => {
  // let loading = openFullScreen();
  const formData = new FormData()

  formData.append('MID', MID); // 直接添加 form.type 的值
  formData.append('name', name); // 直接添加 form.type 的值
  formData.append('key', localStorage.getItem('key'));
  try {
    const response = await fetch("https://movie.cpb2013.top/admin/movie.php?mode=del_video", {
      method: 'POST',
      headers: {
        // 'Authorization': `Bearer ${token}`,
        'Accept': 'application/json',
      },
      body: formData,
    })

    if (response.ok) {
      const result = await response.json()
      if(result['status'] ==='success')
      {
        ElMessage.success('删除成功！')
        await fetchMovieData();
      }
      else if (result['status'] === 'danger') {
        localStorage.removeItem('key');
        ElMessage.error(result['msg']);
        await router.push('/login'); // Use router to navigate to the login page
      }
      else
      {
        ElMessage.error(result['msg'])
      }
    } else {
      ElMessage.error('删除失败！')
    }
  } catch (error) {
    ElMessage.error('请求失败！')
  }
  // closeFullScreen(loading)
}

onMounted(() => {
  fetchMovieData();
});
</script>
